<!DOCTYPE html>

<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
  <meta charset="utf-8" />
  <!-- Set the viewport width to device width for mobile -->
  <meta name="viewport" content="width=device-width" />
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no, maximum-scale=1.0" />
  <title>Locate</title>
  <!-- Included CSS Files (Uncompressed) -->
  <!--<link rel="stylesheet" href="stylesheets/foundation.css">-->
  
  <!-- Included CSS Files (Compressed) -->
  <link rel="stylesheet" href="css/foundation.css" />
  <!--   <link rel="stylesheet" href="css/app.css"> -->
  <!--   <link rel="stylesheet" href="css/styles.css"> -->
  <script src="js/vendor/custom.modernizr.js"></script>

  <!-- IE Fix for HTML5 Tags -->
  <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>
  <body id="main-bgrd" class="antialiased">
    <nav class="top-bar">
      <ul class="title-area">
        <!-- Title Area -->
        <li class="name">
          <h1><a href="#">Locate</a></h1>
        </li>
        <li class="toggle-topbar">
          <a href="#"></a>
        </li>
      </ul>  
      <section class="top-bar-section">
        <!-- Right Nav Section -->
        <ul class="right">
          <li class="divider"></li>
          <li class="has-dropdown">
            <a href="#">Register Your Business</a>
            <ul class="dropdown">
              <li><label>Manage Business</label></li>
              <li><a href="#">My Account</a></li>
              <li><a href="#">Update Location</a></li>
              <li><a href="#">Dropdown Option</a></li>
            </ul>
          </li>
          <li class="divider"></li>
          <li><a href="#">About</a></li>
          <li class="divider"></li>
          <li class="name">
            <a href="contact.html">Get in Touch!</a>
          </li>
        </ul>
        <!-- Right Nav Section END -->
      </section>
    </nav>

    <section id="mainContent">
      <div class="row">
       <div class="large-9 columns" >
        <div id="map_canvas">

        </div>
      </div>
      <div class="large-3 columns">
        <label for="fieldsetInput">Search</label>
        <input type="text" class="input-text" id="fieldsetInput">
      </div>

      <div class="large-3 columns"> 
        <dl class="nice contained tabs">
          <dd class="active"><a href="#nice1" class="active">Events</a></dd>
          <dd><a href="#nice2">Business</a></dd>
          <dd><a href="#nice3">Buy Now</a></dd>
        </dl>
        <ul class="nice contained tabs-content">
          <li class="active" id="nice1Tab">This is nice tab 1's content. Now you see it!</li>
          <li id="nice2Tab">This is nice tab 2's content. Now you see it!</li>
          <li id="nice3Tab">This is nice tab 3's content. Now you see it! </li>
        </ul>
      </div>    
    </div>
  </section>

  <!-- With Floating Window -->
<!-- 
  <section id="mainContent">
    <div class="row">
       <div class="twelve columns" >
        <div id="map_canvas"></div>
      </div>    
    </div>
  </section>

  <section id="floatingWindow">
    <div id="floatWin" class="row">
      <div class="twelve columns">
        <div class="twelve columns">
          <label for="fieldsetInput">Search</label>
          <input type="text" class="input-text" id="fieldsetInput" />
        </div>
        <div class="twelve columns"> 
          <dl class="nice contained tabs">
            <dd class="active"><a href="#nice1" class="active">All</a></dd>
            <dd><a href="#nice2">Events</a></dd>
            <dd><a href="#nice3">Business</a></dd>
            <dd><a href="#nice4">Shop</a></dd>
          </dl>
          <ul class="nice tabs-content contained">
            <li class="active" id="nice1Tab">This is nice tab 1's content. Now you see it!</li>
            <li id="nice2Tab">This is nice tab 2's content. Now you see it!</li>
            <li id="nice3Tab">This is nice tab 3's content. Now you see it!</li>
            <li id="nice4Tab">This is nice tab 4's content. Now you see it!</li>
          </ul>
        </div>
      </div>
    </div>  
  </section>
-->
<footer class="row">
  <div class="large-12 columns">
    <hr>
    <div class="row">
      <div class="large-6 columns">
        <p>© Copyright no one at all. Go to town.</p>
      </div>
      <div class="large-6 columns">
        <ul class="link-list right">
          <li><a href="#">About</a></li>
          <li><a href="#">Developers</a></li>
          <li><a href="#">Jobs</a></li>
          <li><a href="#">Privacy</a></li>
          <li><a href="#">Terms</a></li>
          <li><a href="#">Get in touch!</a></li>
        </ul>
      </div>
    </div>
  </div>
</footer>

<!-- Included JS Files (Uncompressed) -->
<script>document.write('<script src=' +('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') +'.js><\/script>')</script>
<script src="js/foundation/foundation.js"></script>
<!--
  <script src="js/foundation/foundation.js"></script>
  <script src="js/foundation/foundation.dropdown.js"></script>
  <script src="js/foundation/foundation.placeholder.js"></script>
  <script src="js/foundation/foundation.forms.js"></script>
  <script src="js/foundation/foundation.alerts.js"></script>
  <script src="js/foundation/foundation.magellan.js"></script>
  <script src="js/foundation/foundation.reveal.js"></script>
  <script src="js/foundation/foundation.tooltips.js"></script>
  <script src="js/foundation/foundation.clearing.js"></script>
  <script src="js/foundation/foundation.cookie.js"></script>
  <script src="js/foundation/foundation.joyride.js"></script>
  <script src="js/foundation/foundation.orbit.js"></script>
  <script src="js/foundation/foundation.section.js"></script>
  <script src="js/foundation/foundation.topbar.js"></script>
-->
<script>
  $(document).foundation();
</script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.9&sensor=false"></script>
<script type="text/javascript" src="js/maps.js"></script>
</body>
</html>
